<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 要搞懂箭头函数的this指向问题，需要先搞懂执行上下文 -->
    <script>
        const test = ()=>{
            console.log(this,'this1')  //window
        }
        // test()
        const obj = {
            test:()=>{
                console.log(this,'this2') //window
            },
            test1:function(){
                setTimeout(()=>{
                    console.log(this,'this3')  //obj
                    setTimeout(()=>{
                        console.log(this,'this4') //obj 
                    },200)
                },100)
            },
            test2(){
                setTimeout(()=>{
                    console.log(this,'this5')
                })
            }
        }
        const obj1 = {
            aaa(){
                setTimeout(function(){
                    setTimeout(function(){
                        console.log(this,'this1')  //window
                    })
                    setTimeout(()=>{
                        console.log(this,'this2') //window
                    })
                })
                setTimeout(()=>{
                    setTimeout(function(){
                        console.log(this,'this3') //window
                    })
                    setTimeout(()=>{
                        console.log(this,'this4')  //obj
                    })
                    console.log(this,'this5') //obj
                })
            }
        }
        obj1.aaa()
        var msg = 'hello'
        const obj2 = {
            test:()=>{
                msg = 'world'
                console.log(this,'this')
                console.log(this.msg,'this6')
            }
        }
        const fn = obj2.test
        fn()
        console.log(msg)

    </script>
</body>
</html>